import { View } from '@tarojs/components';
import Taro, { useLoad } from '@tarojs/taro';
import { Cell, Navbar} from '@taroify/core';
import {clearToken} from "@/utils/auth";
import './index.css';


export default function Setting() {

  useLoad(() => {
    console.log('Page loaded.');
  });

  const windowInfo = Taro.getWindowInfo();
  const statusBarHeight = windowInfo.statusBarHeight;


  const returnProfilePage = async () => {
    await Taro.navigateBack({
      delta: 1
    });
  };

  const handleLogout = async () => {
    clearToken()
    await Taro.redirectTo({
      url: `/pages/tabs/dialogue/index`,
    });
  };

  return (
    <View style={{ height: '100vh', width: '100vw', backgroundColor: '#f5f5f5' }}>
      {/* 导航栏 */}
      <Navbar
        style={{
          paddingTop: `${(statusBarHeight || 0) + 50}rpx`,
          background: 'linear-gradient(-225deg, #2CD8D5 0%, #C5C1FF 56%, #FFBAC3 100%)',
          boxShadow: '0 2rpx 10rpx rgba(0, 0, 0, 0.1)',
        }}
      >
        <Navbar.NavLeft onClick={returnProfilePage} style={{color: 'black'}} />
        <Navbar.Title style={{ fontSize: '35rpx', color: 'black', fontWeight: 'bold' }}>
          设置
        </Navbar.Title>
      </Navbar>

      {/* 表单内容 */}
      <View style={{ width: '100%', height: `calc(100% - ${(statusBarHeight || 0) + 150}rpx)`, overflowY: 'auto' }}>
          <Cell.Group inset style={{margin: '30rpx'}}>
            <Cell title='背景设置' isLink />
            <Cell title='字号调整' isLink />
          </Cell.Group>

          <Cell.Group inset style={{margin: '30rpx'}}>
            <Cell title='分享智语新航给好友' />
            <Cell title='使用电脑版' />
            <Cell title='帮助与反馈' isLink />
            <Cell title='关于智语新航' isLink />
          </Cell.Group>

          <Cell.Group inset style={{margin: '30rpx'}}>
            <Cell title='账号设置' isLink style={{display: 'none'}} />
            <Cell title='退出登录' onClick={handleLogout} />
          </Cell.Group>
      </View>
    </View>
  );
}
